﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AreaUserSeting.aspx.cs"
    Inherits="ZX.WebApp.Crm.AreaUserSeting" %>

<%@ Register Assembly="ZX.Web.UI.Controls" Namespace="ZX.Web.UI.Controls" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        body
        {
            font-size: 14px;
        }
        .title2
        {
            font-weight: bold;
            font-size: 10.5pt;
            text-align: center;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/reset-fonts-grids/reset-fonts-grids.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/container/assets/skins/sam/container.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/menu/assets/skins/sam/menu.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/button/assets/skins/sam/button.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/resize/assets/skins/sam/resize.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/layout/assets/skins/sam/layout.css" />
    <link type="text/css" rel="stylesheet" href="../Scripts/yui_2.9.0/build/datatable/assets/skins/sam/datatable.css" />
    <link href="../Scripts/yui_2.9.0/build/treeview/assets/treeview-core.css" rel="stylesheet"
        type="text/css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/fonts/fonts-min.css" />
    <link rel="stylesheet" type="text/css" href="../scripts/yui_2.9.0/build/treeview/assets/skins/sam/treeview.css" />
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/element/element-min.js"></script>
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/datasource/datasource-min.js"></script>
    <!-- OPTIONAL: JSON Utility (for DataSource) -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/json/json-min.js"></script>
    <!-- OPTIONAL: Connection Manager (enables XHR for DataSource) -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/connection/connection-min.js"></script>
    <!-- OPTIONAL: Get Utility (enables dynamic script nodes for DataSource) -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/get/get-min.js"></script>
    <!-- OPTIONAL: Drag Drop (enables resizeable or reorderable columns) -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/dragdrop/dragdrop-min.js"></script>
    <!-- OPTIONAL: Calendar (enables calendar editors) -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/calendar/calendar-min.js"></script>
    <!-- Source files -->
    <script type="text/javascript" src="../Scripts/yui_2.9.0/build/datatable/datatable-min.js"></script>
    <script type="text/javascript" src="../scripts/yui_2.9.0/build/layout/layout-min.js"></script>
    <script type="text/javascript" src="../scripts/yui_2.9.0/build/button/button-min.js"></script>
    <script type="text/javascript" src="../scripts/yui_2.9.0/build/container/container-min.js"></script>
    <script type="text/javascript" src="../scripts/yui_2.9.0/build/treeview/treeview-min.js"></script>
    <script src="../Scripts/Public.js" type="text/javascript"></script>
    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
</head>
<body class="yui-skin-sam">
    <form id="form1" action="../Extend/AjaxData/DataProcessin.aspx">
    <table cellspacing="0" cellpadding="0" width="100%" border="1">
        <tr>
            <td style="height: 14px" colspan="3" class="title2">
                <asp:Label ID="Lb_Title" runat="server"><span style="font-weight:bold">区域人员分配</span> </asp:Label>
            </td>
        </tr>
        <tr>
            <td style="height: 18px" colspan="3">
                请选择区域：
            </td>
        </tr>
        <tr valign="top">
            <td valign="top" align="left" width="45%">
                搜索:<input type="text" id="txtName" onkeyup="serachDept();" style="width: 100px" />
                <button id="btnexpend">
                    扩展</button>
                <cc1:TreeView ID="treeDiv1" runat="server" AllowCheck="true" IsOutDepartment="3"
                    IsVirtual="1" Key="DeptId" ParentKey="ParentID" path="DeptPath" Caption="DeptName"
                    TableName="DatDepartment"></cc1:TreeView>
                <script type="text/javascript">
                    var serachDept = function () {
                        var key = $("#txtName").val();
                        $("a").css("color", "")
                        $("a:contains('" + key + "')").css("color", "red");
                    }
                    //设置扩展与收缩
                    $("#btnexpend").toggle(function () {
                        $("#btnexpend").html("收缩");
                        tree1._nodes[1].expandAll();
                    }, function () {
                        $("#btnexpend").html("扩展");
                        tree1._nodes[1].collapseAll();
                    });

      
                </script>
            </td>
            <td valign="middle" align="center">
                <p>
                    <input onclick="MoveSelected();" type="button" value="选定"></p>
                <p>
                    <br>
                    <input onclick="cancelClick();" type="button" value="清除">
                    <br>
                </p>
            </td>
            <td width="45%" style="vertical-align: middle">
                <select multiple="multiple" id="selectedArea" style="width: 100%; height: 240px;">
                </select>
            </td>
        </tr>
    </table>
    </form>
    <form id="form2" action="../Extend/AjaxData/DataProcessin.aspx">
    <textarea style="display: none" id="jsonUsers" rows="2" cols="2" name="jsonUsers"></textarea>
    <textarea style="display: none" id="jsonDataContent" rows="2" cols="2" name="jsonDataContent"></textarea>
    </form>
</body>
<script language="javascript" type="text/javascript">
    var names;
    var id;
    var ids = "";
    var selectedArea = document.getElementById("selectedArea");
    function MoveSelected() {
        var hiLit = tree1.getNodesByProperty('highlightState', 1);
        var labels = [];
        if (YAHOO.lang.isNull(hiLit)) {
            alert("没有选择任何项!");
            return;
        } else {
            for (var i = 0; i < hiLit.length; i++) {
                var node = tree1.getTreeDefinition();
                id = hiLit[i].href.split("#@")[1]
                if (hiLit[i].label != "")
                //names = names + hiLit[i].label;
                    MoveNode(hiLit[i].label, id)
            }
        }

    }

    function setState(areaid) {
        var hiLit = tree1.getNodesByProperty('highlightState', 1);
        if (hiLit != null) {
            for (var i = 0; i < hiLit.length; i++) {
                var node = tree1.getTreeDefinition();
                id = hiLit[i].href.split("#@")[1]
                if (id == areaid)
                //names = names + hiLit[i].label;
                    hiLit[i].highlightState = 0;
            }
        }
        tree1.draw();

    }

    function MoveNode(text, id) {
        var flag = true;
        var length = selectedArea.options.length;
        for (var i = 0; i < length; i++) {
            if (selectedArea.options[i].value == id) {
                flag = false;
            }
        }
        if (id != "00000000-0000-0000-0000-000000000000" && flag == true) {
            selectedArea.options.add(new Option(text, id));
        }
    }
    function cancelClick() {
        if (selectedArea.selectedIndex != -1) {
            var length = selectedArea.options.length;
            for (var i = length - 1; i >= 0; i--) {
                if (selectedArea.options[i].selected == true) {
                    //还原树形控件状态
                    setState(selectedArea.options[i].value);
                    selectedArea.options.remove(i);

                }

            }
        }
    }
    var callback = function (o) {
        if (o.responseText != "0") {

        }
    }
    var Save = function (fkey) {
        $("#selectedArea option").each(function () {
            ids += $(this).val() + ",";
        });
        $("#jsonDataContent").val(ids);
        $("#jsonUsers").val(parent.ids);
        var formObject = document.getElementById('form2');
        YAHOO.util.Connect.setForm(formObject);
        var url = "../Extend/AjaxData/DataProcessin.aspx?action=Save&entity=EmployeePastTimeDepts&r=" + Math.random();
        var request = YAHOO.util.Connect.asyncRequest('Post', url, callback);

    }
</script>
<script type="text/javascript">

    //global variable to allow console inspection of tree:
    var tree1;
    //anonymous function wraps the remainder of the logic:
    (function () {
        var makeBranch = function (parent, label) {

        }

        function AddOption(id, text) {

            var selectedArea = document.getElementById("selectedArea");
            selectedArea.options.add(new Option(text, id));
        };

        var treeInit = function () {
            tree1 = new YAHOO.widget.TreeView("treeDiv1");
            makeBranch(tree1.getRoot());
            tree1.setNodesProperty('propagateHighlightUp', true);
            tree1.setNodesProperty('propagateHighlightDown', true);
            tree1.subscribe('clickEvent', tree1.onEventToggleHighlight);
            tree1.render();
            tree1._nodes[1].expand();
            //加载权限
            var request = "../Extend/AjaxData/DataProcessin.aspx?action=Get&entity=EmployeePastTimeDepts&condition&EmpId=" + getPar1("empId") + "";
            YAHOO.util.Connect.asyncRequest('POST', request, {
                success: function (res) {
                    var inventory;
                    try {
                        var str = res.responseText;
                        //区域集合
                        var dept = str.split('~');
                        //区域名称
                        var areaName = "";
                        //区域ID
                        var areaId = "";
                        var areaIds = "";
                        for (var i = 0; i < dept.length; i++) {
                            areaId = dept[i].split(',')[0];
                            areaName = dept[i].split(',')[1];
                            if (areaName != undefined) {
                                AddOption(areaId, areaName);
                                areaIds += areaId;
                                areaIds += ",";
                            }
                        }
                        checkNode(areaIds);
                        //inventory = JSON.parse(res.responseText);
                        //alert(inventory);
                        tree1.render();

                    }
                    catch (e) {
                    }
                    finally {
                    }
                },
                failure: function (error) {
                    alert("读取菜单数据错误：" + error.statusText);
                }
            }, null);

        }

        function checkNode(areaIds) {
            var childNodes = tree1.getNodeCount();
            var topNodes = tree1.getNodesByProperty("href");
            for (var i = 0; i < childNodes; ++i) {
                var id = topNodes[i].href.split("#@")[1];
                if (areaIds.indexOf(id) > -1) {
                    //for (var node in topNodes) {
                    topNodes[i].highlightState = 1; // setNodesByProperty('highlightState');
                }
            }
            tree1.render();
        };
        //Add an onDOMReady handler to build the tree when the document is ready
        YAHOO.util.Event.onDOMReady(treeInit);

    })();
</script>
</html>
